<template>
  <div>
    <van-form>
      <van-field  label='手机号' v-model='mobile' :rules="[{'required':true,'message':'手机号不能为空'}]"/>
      <van-button @click='send'>{{mes}}</van-button>
      <van-field  label='验证码' v-model='code'/>
      <van-button @click="login">登录</van-button>
    </van-form>
  </div>
</template>

<script>
export default {
name: "loging",
  data(){
    return{
      mobile:'',
      code:'',
      mes:"获取验证码"
    }
  },
  methods:{
    sendsms(){
      this.$axios.get('/user/sendsms?mobile='+this.mobile).then(res=>{
        if(res.data.code==200){
          this.$toast.success('已发送');
          alert(res.data.matter)
          // 3.成功，进入倒计时，0再次发送
          // setInterval(,1000)
        }else{
          this.$toast.fail('发送失败');
        }
      })
    },
    send(){
      // 1.手机号有效性验证
      let reg = /^1[3-9]\d{9}$/
      if(!reg.test(this.mobile)){
        alert('手机号不合法')
        return false;
      }
      // 2.调用发短信接口
      this.sendsms()
    },
    login(){
      this.$axios.post('/user/login',{'mobile':this.mobile,'code':this.code}).then(res=>{
        if(res.data.code==200){
          this.$toast.success('登陆成功');
          console.log(res.data.user)
          localStorage.setItem('token',res.data.token)
          localStorage.setItem('id',res.data.user['id'])
          localStorage.setItem('name',res.data.user['name'])
          // localStorage.setItem('retoken',res.data.retoken)
          console.log(res.data.token)
        }else{
          this.$toast.fail(res.data.matter);
        }
      })
    }
  }
}
</script>

<style scoped>

</style>
